<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
    <style>
      span {
        user-select: none;
        cursor: pointer;
      }
    </style>

    <script>
      L2Dwidget.init({
        model: {
          jsonPath: 'https://unpkg.com/live2d-widget-model-koharu@1.0.5/assets/koharu.model.json',
          scale: 1,
          hHeadPos: 0.5,
          vHeadPos: 0.618,
        },
        display: {
          position: 'right',
          width: 100,
          height: 150,
          hOffset: -25,
          vOffset: -25,
        },
        mobile: { show: true, scale: 0.5 },
        react: { opacityDefault: 0.8, opacityOnHover: 0.2 },
      });

      window.addEventListener(
        'DOMContentLoaded',
        function (e) {
          function getTime() {
            var times = document.querySelector('.times');
            var time = new Date();
            var hours = time.getHours();
            hours = hours < 10 ? '0' + hours : hours;
            var minutes = time.getMinutes();
            minutes = minutes < 10 ? '0' + minutes : minutes;
            var seconds = time.getUTCSeconds();
            seconds = seconds < 10 ? '0' + seconds : seconds;
            times.innerHTML = `Time: <span>${hours}时 ${minutes}分</span><span>${seconds}</span><span>秒</span>`;
          }
          getTime();
          setInterval(getTime, 1000);

          var dates = document.querySelector('.dates');
          var span = dates.querySelectorAll('span');
          var div = dates.querySelector('div');
          var date = new Date();
          var years = date.getFullYear();
          span[0].innerHTML = `${years}`;
          var months = date.getMonth();
          span[1].innerHTML = `${months + 1}`;
          var dates = date.getDate();
          span[2].innerHTML = `${dates}`;
          var days = date.getDay();
          var arrays = ['星期天', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
          div.innerHTML = `${arrays[days]}`;

          // 圣诞树特效
          let tree = document.querySelector('.tree');
          for (let i = 0; i < 128; i++) {
            let li = document.createElement('li');
            li.style = '--i:' + i;
            tree.appendChild(li);
          }
        },
        true
      );
    </script>

    <!-- 设置鼠标点击特效 -->
    <script type="text/javascript">
      function randomColor() {
        return `rgb(${Math.floor(Math.random() * 256)},${Math.floor(Math.random() * 256)},${Math.floor(
          Math.random() * 256
        )})`;
      }
      var arr = ['🍉', '🍭', '🍵', '🍰', '🍓', '🍒', '🍑', '🍊', '🍅', '🍄', '🍄', '🍤', 'Kayson'];
      document.addEventListener('click', function (e) {
        let span = document.createElement('span');
        span.innerHTML = arr[Math.floor(Math.random() * arr.length)];
        span.style.position = 'absolute';
        span.style.color = randomColor();
        span.style.left = e.pageX + 'px';
        span.style.top = e.pageY + 'px';
        span.style.transition = 'all .5s';
        setTimeout(function () {
          span.style.opacity = '1';
          span.style.transform = 'translateY(-50px) scale(1.5)';
        }, 100);
        setTimeout(function () {
          span.style.opacity = '0';
          span.style.transform = 'translateY(-100px) scale(0)';
        }, 500);
        setTimeout(function () {
          let spanChilds = document.getElementsByTagName('span');
          for (let i = 0; i < spanChilds.length; i++) {
            if (spanChilds[i].style.opacity === '0') {
              document.body.removeChild(spanChilds[i]);
            }
          }
        }, 1000);
        document.body.appendChild(span);
      });
    </script>

    <!-- 引入雪花样式 -->
    <link rel="stylesheet" href="./index_Resource/snow_style.css" />
    <!--生成动态雪花 -->
    <link rel="stylesheet" href="./index_Resource/snow_flowers.css" />
    <!-- 主页样式文件 -->
    <link rel="stylesheet" href="./index_Resource/index.css" />
    <title>index.html</title>
  </head>

  <body>
    <h1>——Kayson's HomeWork</h1>

    <div class="content">
      <p>8月份</p>
      <a href="./8.22-三级导航栏/nav.html">8.22---用sass布局三级导航栏</a>
      <a href="./8.23-株洲小巨蛋/egg_index.html">8.23---用sass布局“株洲小巨蛋”主页</a>
      <a href="./8.23-株洲小巨蛋/egg_token.html">8.23---用sass布局“株洲小巨蛋”推荐页</a>
      <a href="./8.30-Transform/导航栏下划线样式.html">8.30---Transform-导航栏下划线样式</a>
      <a href="./8.30-Transform/循环边框.html">8.30---Transform-循环边框</a>
      <a href="./8.30-Transform/太极旋转.html">8.30---Transform-太极旋转</a>
      <a href="./8.31-Animation/进度条作业.html">8.31---Animation进度条作业</a>
      <p>9月份</p>
      <a href="http://chen-kaixun.gitee.io/group-purchase-project/">9.6~9.9---“团购商城”--移动端响应式项目</a>
      <a href="./9.13-初识别Javascript/变量练习.html">9.13---初识别Javascript</a>
      <a href="./9.14-运算练习/运算练习.html">9.14---运算练习</a>
      <a href="./9.15-流程控制作业/流程控制练习.html">9.15---流程控制</a>
      <a href="./9.16-函数作业/函数作业.html">9.16---函数作业</a>
      <a href="./9.17-(强化)流程控制作业/循环强化练习.html">9.17---(强化)流程控制作业</a>
      <a href="./9.19-数组作业/数组作业.html">9.19---数组作业</a>
      <a href="./9.21-(强化)数组作业/综合练习.html">9.21---(强化)数组作业</a>
      <a href="./9.22-倒计时案例/倒计时.html">9.22---倒计时作业</a>
      <a href="./9.26-js基础测试/JavaScript测试-陈凯逊.md">9.26---js基础测试</a>
      <a href="./9.27-js节点生成表单数据/利用js生成表格内容.html">9.27---js节点生成表单中的数据</a>
      <a href="./9.28-选项卡作业/选项卡作业.html">9.28---选项卡作业</a>
      <p>10月份</p>
      <a href="./10.1~10.7-富豪榜作业/index.html">10.1~10.7---富豪榜作业</a>
      <a href="./10.8-无缝轮播图/index.html">10.8---js制作无缝轮播图</a>
      <a href="./10.9-小球跟随/小球跟随.html">10.9---移动端事件</a>
      <a href="./10.11-放大镜特效/index.html">10.11---放大镜特效</a>
      <a href="./10.14-动态渲染轮播图/index.html">10.14---动态渲染无缝轮播图</a>
      <a href="./10.18-懒加载/懒加载.html">10.18---懒加载</a>
      <a href="./10.24-this指向问题/作业题.html">10.24---this指向问题</a>
      <a href="./10.25_面向对象制作轮播图/index.html">10.25---面向对象制作轮播图</a>
      <a href="./10.26_炫酷小球案例/index.html">10.26---炫酷小球案例</a>
      <a href="./10.26_红绿灯案例/index.html">10.26---红绿灯案例</a>
      <a href="./10.27-Class仿网易云轮播图/index.html">10.27---Class仿网易云轮播图</a>
    </div>

    <!-- 时间 -->
    <h2 class="times">
      <span></span>
    </h2>

    <!-- 日历 -->
    <div class="dates">
      <p>Calendar</p>
      <span></span>
      年
      <span></span>
      月
      <span></span>
      日
      <div></div>
    </div>

    <!-- 圣诞树 -->
    <ul class="tree">
      <div class="star"></div>
    </ul>

    <!-- 雪花特效 -->
    <div class="snowflake_box">
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
      <figure class="snowflake">
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div class="item">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
      </figure>
    </div>
  </body>
</html>
